/**
 * time: 2025-09-16
 * author: XJ
 * description: 产品基本信息页面
 */

import { InboxOutlined, UploadOutlined } from '@ant-design/icons';
import { PageContainer } from '@ant-design/pro-components';
import { useModel } from '@umijs/max';
import { Button, Form, Input, Row, Select, Steps, TreeSelect, Upload } from 'antd';
import Dragger from 'antd/es/upload/Dragger';
import { Col } from 'antd/lib';
import area from '@/components/staticFile/region_options.json';
import TextArea from 'antd/es/input/TextArea';
const COMMON_FIELD_STYLE = { width: '100%', height: 40, borderRadius: 4 };
const FORM_LAYOUT = {
  labelCol: { span: 6 }, // 调整标签宽度，避免长标签换行
  wrapperCol: { span: 18 },
  layout: 'horizontal' as const,
  
  size: 'middle' as const, // 统一表单控件尺寸
};
const ProductDesc: React.FC<{form:any}> = (props) => {
  const { stepProps, setStepProps } = useModel('PublishProduct.stepProps');

  const nextStep = () => {
    props.form.validateFields(["productEvaluation","productDetail"]).then(() => {
       setStepProps((prev) => ({ ...prev, current: prev.current + 1 }))
    })
  };
  const lastStep = () => {
    setStepProps((prev) => ({ ...prev, current: prev.current - 1 }));
  };
  return (
    // <Form
    //   {...FORM_LAYOUT}

    //   onFinish={onFinish}
    // >
    //   <div style={{ padding: 20, backgroundColor: '#f8f9fa', boxSizing: 'border-box' }}>
        // <div
        //   style={{
        //     backgroundColor: '#fff',
        //     padding: 20,
        //     borderRadius: 8,
        //     boxShadow: '0 1px 3px rgba(0,0,0,0.05)',
        //   }}
        // >
        <>
          <div
            style={{
              fontSize: 16,
              fontWeight: 500,
              color: '#1f2937',
              marginBottom: 12,
            }}
          >
            产品描述
          </div>
          <Form.Item
            name="productEvaluation"
            label="产品简介"
            rules={[{ required: true, message: '请输入产品简介' }]}
            style={{ marginBottom: 20 }}
          >
            <TextArea
              maxLength={500}
              showCount
              style={{
                minHeight: 100,
                resize: 'vertical',
                ...COMMON_FIELD_STYLE,
              }}
            />
          </Form.Item>
          <Form.Item
            name="productDetail"
            label="产品详情"
            rules={[{ required: true, message: '请输入产品详情' }]}
            style={{ marginBottom: 20 }}
          >
            <TextArea
              maxLength={500}
              showCount
              style={{
                minHeight: 100,
                resize: 'vertical',
                ...COMMON_FIELD_STYLE,
              }}
            />
          </Form.Item>
          <Form.Item label={null} style={{ marginTop: 40, textAlign: 'center' }}>
            <Button style={{ marginRight: 10 }} onClick={lastStep} type="primary" >
              上一步
            </Button>
            <Button type="primary" onClick={nextStep}>
              下一步
            </Button>
          </Form.Item>
          </>
    //    </div>
    //   </div>
    // </Form> 
  );
};

export default ProductDesc;
